<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script type="text/javascript" src="angular.js"></script>
	<script type="text/javascript" src="angular-route.js"></script>
</head>
<body ng-app="demo" ng-controller="demoCtro" class="row text-center">
	<div ng-app="DemoApp" ng-controller="DemoController">
    <table class="table table-striped">
        <thead>
            <tr>
                <td>ID</td>
                <td>FirstName</td>
                <td>LastName</td>
                <td>Status</td>
                <td>Address</td>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="emp in persons">
                <td>{{emp.ID}}</td>
                <td>{{emp.FirstName}}</td>
                <td>{{emp.LastName}}</td>
                <td>{{emp.Status}}</td>
                <td>{{emp.Address}}</td>
            </tr>
        </tbody>
    </table>
    <tm-pagination conf="paginationConf"></tm-pagination>
</div>
<script type="text/javascript">
    var app = angular.module('DemoApp', ['tm.pagination']);
 
    app.controller('DemoController', ['$scope', 'BusinessService', function ($scope, BusinessService) {
 
        var GetAllEmployee = function () {
 
            var postData = {
                pageIndex: $scope.paginationConf.currentPage,
                pageSize: $scope.paginationConf.itemsPerPage
            }
 
            BusinessService.list(postData).success(function (response) {
                $scope.paginationConf.totalItems = response.count;
                $scope.persons = response.items;
            });
 
        }
 
        //配置分页基本参数
        $scope.paginationConf = {
            currentPage: 1,
            itemsPerPage: 5
        };
 
      
        // 当页码和页面记录数发生变化时监控后台查询
        // 如果把currentPage和itemsPerPage分开监控的话则会触发两次后台事件。 
       
        $scope.$watch('paginationConf.currentPage + paginationConf.itemsPerPage', GetAllEmployee);
    }]);
 
 
    //业务类
    app.factory('BusinessService', ['$http', function ($http) {
        var list = function (postData) {
            return $http.post('../json/json2.json', postData);
        }
 
        return {
            list: function (postData) {
                return list(postData);
            }
        }
    }]);
</script>
 
</body>

	
  
</html>